.fieldReadnly {
    border-color: rgba(0, 0, 0, 0);
}

.ophide {
    opacity: 0;
}

.width0 {
    width: 0px !important;
    height: 0px !important;
}

.arrowup {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

.f-btn.f-first-ex {
    position: inherit;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.f-btn.f-middle-ex {
    border-radius: 0;
    margin-left: -1px;
    right: 0 !important;
    left: 0 !important;
    position: inherit;
}

.f-btn.f-last-ex {
    right: 0 !important;
    left: 0 !important;
    position: inherit;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -1px;
}

.f-animation .f-tree-node > .f-tree-cell > .f-tree-cell-inner {
    max-height: 100px;
    opacity: 1;
    transition: max-height .3s,padding .3s,opacity .3s;
}

.f-animation .f-tree-node.f-tree-anim-collapsing > .f-tree-cell > .f-tree-cell-inner {
    max-height: 0;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    opacity: 0;
}

.f-animation .f-panel.f-panel-anim-collapsing {
    -webkit-transition: width .3s,height .3s;
    transition: width .3s,height .3s;
}

.f-animation .f-panel.f-panel-anim-expanding {
    z-index: 200000;
    -webkit-transition: width .3s,height .3s;
    transition: width .3s,height .3s;
}

.f-animation .f-btn, .f-animation .f-calendar-header .f-calendar-nav, .f-animation .f-checkbox, .f-animation .f-datalist-item, .f-animation .f-grid-row, .f-animation .f-radiobutton, .f-animation .f-tab-header, .f-animation .f-tab-header .f-tool.f-tool-close .f-tool-icon, .f-animation .f-tool, .f-animation .f-tree-node {
    -webkit-transition: background-color .3s,border-color .3s,color .3s;
    transition: background-color .3s,border-color .3s,color .3s;
}

    .f-animation .f-checkbox:after, .f-animation .f-radiobutton:after {
        -webkit-transition: transform .3s,opacity .3s;
        transition: transform .3s,opacity .3s;
    }

.f-animation .f-tabstrip-header-inkbar {
    -webkit-transition: width .3s,left .3s;
    transition: width .3s,left .3s;
}

.f-animation .f-btn .f-btn-icon-arrowd.ui-icon, .f-animation .f-field-dropdownbox-wrap .f-field-triggerbox-icon.f-triggericon-arrowdown.ui-icon, .f-animation .f-field-dropdownlist-wrap .f-field-triggerbox-icon.f-triggericon-arrowdown.ui-icon, .f-animation .f-panel.f-accordionpane.f-panel-collapsed > .f-panel-header .f-tool.f-tool-toggle .ui-icon, .f-animation .f-panel > .f-panel-header .f-tool.f-tool-toggle .ui-icon, .f-animation .f-tree-node .f-tree-cell-icon.f-tree-expander.ui-icon {
    -webkit-transition: transform .3s;
    transition: transform .3s;
}
.f-compactmode .f-panel-header{padding:6px}
.f-compactmode .f-tabstrip-header{padding:0}
.f-compactmode .f-tabstrip-header>.f-panel-title{min-height:28px}
.f-compactmode .f-tree-cell-inner{padding-top:3px;padding-bottom:3px}
.f-compactmode .f-tree-headerstyle .f-tree-node.ui-widget-header .f-tree-cell-inner{padding-top:6px;padding-bottom:6px}
.f-compactmode .f-tree-minimode-list .f-tree-minimode-item .f-tree-minimode-item-inner{padding-top:5px;padding-bottom:5px}
.f-compactmode .f-tree-minimode-list .f-tree-minimode-icon{font-size:18px;min-width:18px;height:18px}
.f-compactmode .f-grid-cell-inner{padding-top:3px;padding-bottom:3px}
.f-compactmode .f-grid-colheader-inner{padding-top:5px;padding-bottom:5px}
.f-compactmode .f-grid-bigdata .f-grid-row{height:23px}
.f-compactmode .f-field-textbox{padding-top:3px;padding-bottom:3px}
.f-compactmode .f-field-numberbox-wrap .f-field-triggerbox-icon.f-triggericon-numberup{top:2px}
.f-compactmode .f-field-numberbox-wrap .f-field-triggerbox-icon.f-triggericon-numberdown{top:12px}
.f-compactmode .f-field-numberbox-wrap .f-field-triggerbox-icons{margin-top:-11px}
.f-compactmode .f-field-numberbox-wrap .f-field-triggerbox-icon.f-triggericon-numberdown,.f-compactmode .f-field-numberbox-wrap .f-field-triggerbox-icon.f-triggericon-numberup{font-size:12px}
.f-compactmode .f-field-dropdownlist-pop>li{padding-top:3px;padding-bottom:3px}
.f-compactmode .f-menu-item-text{line-height:21px}
.f-compactmode .f-menu-item.f-menu-separator{margin-top:1px;margin-bottom:1px}
.f-compactmode .f-toolbar{padding-top:2px;padding-bottom:2px}
.f-compactmode .f-toolbar>.f-toolbar-body{min-height:24px}
.f-compactmode .f-toolbar-title{line-height:24px}
.f-largemode .f-toolbar-buttonplain .f-buttongroup .f-btn{padding-top:6px;padding-bottom:6px}
.f-compactmode .f-field-body-checkboxlabel,.f-compactmode .f-field-checkbox-icon-wrap,.f-compactmode .f-field-label{margin-top:4px;margin-bottom:4px}
.f-compactmode .f-field.f-field-fieldlabel-top .f-field-fieldlabel-cell{height:24px}
.f-compactmode .f-btn{padding-top:3px;padding-bottom:3px}
.f-compactmode .f-btn.f-btn-small{padding-top:2px;padding-bottom:2px}
.f-compactmode .f-btn.f-btn-medium{padding-top:4px;padding-bottom:4px}
.f-compactmode .f-btn.f-btn-large{padding-top:6px;padding-bottom:6px}
.f-compactmode .f-btn.f-btn-icon-only{padding-left:3px;padding-right:3px}
.f-compactmode .f-toolbar.f-toolbar-buttonfill .f-btn{padding-top:7px;padding-bottom:7px}
.f-compactmode .f-region-cover{width:28px}
.f-compactmode .f-region-cover .f-tool{height:29px}
.f-compactmode .f-region-cover .f-region-cover-text{top:28px}
.f-compactmode .ui-icon.f-messagebox-icon{min-width:50px;height:50px;font-size:50px}
.f-compactmode .f-tablestyle .f-field-fieldlabel{margin:0;padding:6px}
.f-compactmode .f-tablestyle .f-field-label,.f-compactmode .f-tablestyle .f-field-textbox{border-width:0;border-radius:0;padding:6px;margin:0;min-height:28px}
.f-compactmode .f-tablestyle .f-field-fileupload-wrap .f-field-body-cell-rightpart{padding:3px}
.f-compactmode .f-tablestyle .f-field-body-checkboxlabel,.f-compactmode .f-tablestyle .f-field-checkbox-icon-wrap{margin-top:6px;margin-bottom:6px}
.f-compactmode .f-tablestyle .f-field-checkbox-icon{margin-left:6px}
.f-compactmode .f-tablestyle .f-field-body-checkboxlabel{margin-left:26px}
.f-compactmode .f-calendar-time>span{line-height:22px}
.f-compactmode .f-calendar-today{height:22px}
.f-compactmode .f-calendar-day{padding:1px 3px}
.f-compactmode .f-calendar-title{line-height:28px}
.f-compactmode .f-grouppanel-header{padding:0 5px}
@-webkit-keyframes f-scale-down-in {
    from {
        opacity: 0;
        -webkit-transform: scaleY(.9);
        -webkit-transform-origin: 0 0;
    }

    to {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -webkit-transform-origin: 0 0;
    }
}

@keyframes f-scale-down-in {
    from {
        opacity: 0;
        transform: scaleY(.9);
        transform-origin: 0 0;
    }

    to {
        opacity: 1;
        transform: scaleY(1);
        transform-origin: 0 0;
    }
}

@-webkit-keyframes f-scale-down-out {
    from {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -webkit-transform-origin: 0 0;
    }

    to {
        opacity: 0;
        -webkit-transform: scaleY(.9);
        -webkit-transform-origin: 0 0;
    }
}

@keyframes f-scale-down-out {
    from {
        opacity: 1;
        transform: scaleY(1);
        transform-origin: 0 0;
    }

    to {
        opacity: 0;
        transform: scaleY(.9);
        transform-origin: 0 0;
    }
}

@-webkit-keyframes f-scale-up-in {
    from {
        opacity: 0;
        -webkit-transform: scaleY(.9);
        -webkit-transform-origin: 100% 100%;
    }

    to {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -webkit-transform-origin: 100% 100%;
    }
}

@keyframes f-scale-up-in {
    from {
        opacity: 0;
        transform: scaleY(.9);
        transform-origin: 100% 100%;
    }

    to {
        opacity: 1;
        transform: scaleY(1);
        transform-origin: 100% 100%;
    }
}

@-webkit-keyframes f-scale-up-out {
    from {
        opacity: 1;
        -webkit-transform: scaleY(1);
        -webkit-transform-origin: 100% 100%;
    }

    to {
        opacity: 0;
        -webkit-transform: scaleY(.9);
        -webkit-transform-origin: 100% 100%;
    }
}

@keyframes f-scale-up-out {
    from {
        opacity: 1;
        transform: scaleY(1);
        transform-origin: 100% 100%;
    }

    to {
        opacity: 0;
        transform: scaleY(.9);
        transform-origin: 100% 100%;
    }
}

@-webkit-keyframes f-scale-left-in {
    from {
        opacity: 0;
        -webkit-transform: scaleX(.9);
        -webkit-transform-origin: 0 0;
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        -webkit-transform-origin: 0 0;
    }
}

@keyframes f-scale-left-in {
    from {
        opacity: 0;
        transform: scaleX(.9);
        transform-origin: 0 0;
    }

    to {
        opacity: 1;
        transform: scaleX(1);
        transform-origin: 0 0;
    }
}

@-webkit-keyframes f-scale-left-out {
    from {
        opacity: 1;
        -webkit-transform: scaleX(1);
        -webkit-transform-origin: 0 0;
    }

    to {
        opacity: 0;
        -webkit-transform: scaleX(.9);
        -webkit-transform-origin: 0 0;
    }
}

@keyframes f-scale-left-out {
    from {
        opacity: 1;
        transform: scaleX(1);
        transform-origin: 0 0;
    }

    to {
        opacity: 0;
        transform: scaleX(.9);
        transform-origin: 0 0;
    }
}

@-webkit-keyframes f-scale-right-in {
    from {
        opacity: 0;
        -webkit-transform: scaleX(.9);
        -webkit-transform-origin: 100% 100%;
    }

    to {
        opacity: 1;
        -webkit-transform: scaleX(1);
        -webkit-transform-origin: 100% 100%;
    }
}

@keyframes f-scale-right-in {
    from {
        opacity: 0;
        transform: scaleX(.9);
        transform-origin: 100% 100%;
    }

    to {
        opacity: 1;
        transform: scaleX(1);
        transform-origin: 100% 100%;
    }
}

@-webkit-keyframes f-scale-right-out {
    from {
        opacity: 1;
        -webkit-transform: scaleX(1);
        -webkit-transform-origin: 100% 100%;
    }

    to {
        opacity: 0;
        -webkit-transform: scaleX(.9);
        -webkit-transform-origin: 100% 100%;
    }
}

@keyframes f-scale-right-out {
    from {
        opacity: 1;
        transform: scaleX(1);
        transform-origin: 100% 100%;
    }

    to {
        opacity: 0;
        transform: scaleX(.9);
        transform-origin: 100% 100%;
    }
}

@-webkit-keyframes f-slide-left-in {
    from {
        opacity: 0;
        -webkit-transform: translateX(80%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes f-slide-left-in {
    from {
        opacity: 0;
        transform: translateX(80%);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@-webkit-keyframes f-slide-left-out {
    from {
        opacity: 1;
        -webkit-transform: translateX(0);
    }

    to {
        opacity: 0;
        -webkit-transform: translateX(-80%);
    }
}

@keyframes f-slide-left-out {
    from {
        opacity: 1;
        transform: translateX(0);
    }

    to {
        opacity: 0;
        transform: translateX(-80%);
    }
}

@-webkit-keyframes f-slide-right-in {
    from {
        opacity: 0;
        -webkit-transform: translateX(-80%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateX(0);
    }
}

@keyframes f-slide-right-in {
    from {
        opacity: 0;
        transform: translateX(-80%);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@-webkit-keyframes f-slide-right-out {
    from {
        opacity: 1;
        -webkit-transform: translateX(0);
    }

    to {
        opacity: 0;
        -webkit-transform: translateX(80%);
    }
}

@keyframes f-slide-right-out {
    from {
        opacity: 1;
        transform: translateX(0);
    }

    to {
        opacity: 0;
        transform: translateX(80%);
    }
}

@-webkit-keyframes f-slide-up-in {
    from {
        opacity: 0;
        -webkit-transform: translateY(80%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes f-slide-up-in {
    from {
        opacity: 0;
        transform: translateY(80%);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@-webkit-keyframes f-slide-up-out {
    from {
        opacity: 1;
        -webkit-transform: translateY(0);
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(-80%);
    }
}

@keyframes f-slide-up-out {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(-80%);
    }
}

@-webkit-keyframes f-slide-down-in {
    from {
        opacity: 0;
        -webkit-transform: translateY(-80%);
    }

    to {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

@keyframes f-slide-down-in {
    from {
        opacity: 0;
        transform: translateY(-80%);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@-webkit-keyframes f-slide-down-out {
    from {
        opacity: 1;
        -webkit-transform: translateY(0);
    }

    to {
        opacity: 0;
        -webkit-transform: translateY(80%);
    }
}

@keyframes f-slide-down-out {
    from {
        opacity: 1;
        transform: translateY(0);
    }

    to {
        opacity: 0;
        transform: translateY(80%);
    }
}

@-webkit-keyframes f-fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes f-fade-in {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@-webkit-keyframes f-fade-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes f-fade-out {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@-webkit-keyframes f-pop-in {
    from {
        opacity: 0;
        -webkit-transform: scale(.5);
    }

    to {
        opacity: 1;
        -webkit-transform: scale(1);
    }
}

@keyframes f-pop-in {
    from {
        opacity: 0;
        transform: scale(.5);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

@-webkit-keyframes f-pop-out {
    from {
        opacity: 1;
        -webkit-transform: scale(1);
    }

    to {
        opacity: 0;
        -webkit-transform: scale(.5);
    }
}

@keyframes f-pop-out {
    from {
        opacity: 1;
        transform: scale(1);
    }

    to {
        opacity: 0;
        transform: scale(.5);
    }
}

@-webkit-keyframes f-flip-in {
    from {
        -webkit-transform: rotateY(-90deg) scale(.8);
    }

    to {
        -webkit-transform: rotateY(0);
    }
}

@keyframes f-flip-in {
    from {
        transform: rotateY(-90deg) scale(.8);
    }

    to {
        transform: rotateY(0);
    }
}

@-webkit-keyframes f-flip-out {
    from {
        -webkit-transform: rotateY(0);
    }

    to {
        -webkit-transform: rotateY(90deg) scale(.8);
    }
}

@keyframes f-flip-out {
    from {
        transform: rotateY(0);
    }

    to {
        transform: rotateY(90deg) scale(.8);
    }
}

@-webkit-keyframes f-rotate {
    from {
        -webkit-transform: rotate(0);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes f-rotate {
    from {
        transform: rotate(0);
    }

    to {
        transform: rotate(360deg);
    }
}

.f-anim {
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
}

.f-scale-down-in {
    -webkit-animation-name: f-scale-down-in;
    animation-name: f-scale-down-in;
}

.f-scale-down-out {
    -webkit-animation-name: f-scale-down-out;
    animation-name: f-scale-down-out;
}

.f-scale-up-in {
    -webkit-animation-name: f-scale-up-in;
    animation-name: f-scale-up-in;
}

.f-scale-up-out {
    -webkit-animation-name: f-scale-up-out;
    animation-name: f-scale-up-out;
}

.f-scale-left-in {
    -webkit-animation-name: f-scale-left-in;
    animation-name: f-scale-left-in;
}

.f-scale-left-out {
    -webkit-animation-name: f-scale-left-out;
    animation-name: f-scale-left-out;
}

.f-scale-right-in {
    -webkit-animation-name: f-scale-right-in;
    animation-name: f-scale-right-in;
}

.f-scale-right-out {
    -webkit-animation-name: f-scale-right-out;
    animation-name: f-scale-right-out;
}

.f-slide-left-in {
    -webkit-animation-name: f-slide-left-in;
    animation-name: f-slide-left-in;
}

.f-slide-left-out {
    -webkit-animation-name: f-slide-left-out;
    animation-name: f-slide-left-out;
}

.f-slide-right-in {
    -webkit-animation-name: f-slide-right-in;
    animation-name: f-slide-right-in;
}

.f-slide-right-out {
    -webkit-animation-name: f-slide-right-out;
    animation-name: f-slide-right-out;
}

.f-slide-up-in {
    -webkit-animation-name: f-slide-up-in;
    animation-name: f-slide-up-in;
}

.f-slide-up-out {
    -webkit-animation-name: f-slide-up-out;
    animation-name: f-slide-up-out;
}

.f-slide-down-in {
    -webkit-animation-name: f-slide-down-in;
    animation-name: f-slide-down-in;
}

.f-slide-down-out {
    -webkit-animation-name: f-slide-down-out;
    animation-name: f-slide-down-out;
}

.f-fade-in {
    -webkit-animation-name: f-fade-in;
    animation-name: f-fade-in;
}

.f-fade-out {
    -webkit-animation-name: f-fade-out;
    animation-name: f-fade-out;
}

.f-pop-in {
    -webkit-animation-name: f-pop-in;
    animation-name: f-pop-in;
}

.f-pop-out {
    -webkit-animation-name: f-pop-out;
    animation-name: f-pop-out;
}

.f-flip-in {
    -webkit-animation-name: f-flip-in;
    animation-name: f-flip-in;
    -webkit-animation-duration: .15s;
    animation-duration: .15s;
}

.f-flip-out {
    -webkit-animation-name: f-flip-out;
    animation-name: f-flip-out;
    -webkit-animation-duration: .15s;
    animation-duration: .15s;
}

.f-rotate {
    -webkit-animation-name: f-rotate;
    animation-name: f-rotate;
}



.ripple-container {
}

.ripple-container .ripple {
    background-color: rgba(255,255,255,0.4);
    animation: ripple 1.5s forwards cubic-bezier(0, 0, 0.2, 1);
}

@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 1;
    }

    80% {
        transform: scale(1);
    }

    100% {
        opacity: 0;
    }
}